<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>惠普 | 注册</title>
    <link rel="shortcut icon" href="./images/logo.png" type="image/x-icon">
    <link rel="stylesheet" href="./css/register.css">
</head>

<body>
    <div id="root">
        <div class="app-content">
            <div class="bar-header">
                <div class="container">
                    <div class="navbar-header row">
                        <img src="./images/logo.png" width="50" height="40">
                    </div>
                </div>
            </div>
            <div class="sign-up">
                <div class="default">
                    <div class="container">
                        <div class="client row">
                            <div class="hp">HP</div>
                        </div>
                    </div>
                    <div class="sign-up-form container">
                        <div class="end row">
                            <div class="wrapper">
                                <div class="w-header">
                                    <h5 class="title">创建您的 HP 帐户</h5>
                                    <p class="desc">一个帐户即可让您连接至您所有的 HP 应用程序</p>
                                </div>
                                <div class="panel css-1">
                                    <div class="content">
                                        <div class="d-flex justify-content-center margin-b-20">
                                            <a href="./login.html" class="link">已拥有 HP 帐户? 登录</a>
                                        </div>
                                        <form class="form-container">
                                            <div class="row-names">
                                                <div class="lastname bot css">
                                                    <label data-focused="true" class="t-label">姓氏<span>*</span></label>
                                                    <div class="input">
                                                        <input name="lastname" type="text"></div>
                                                </div>
                                                <div class="name bot css">
                                                    <label data-focused="false" class="f-label">昵称<span>*</span></label>
                                                    <div class="input">
                                                        <input name="name" type="text"></div>
                                                </div>
                                            </div>
                                            <div class="email bot css">
                                                <label data-focused="false" class="f-label">电子邮件地址<span>*</span></label>
                                                <div class="input">
                                                    <input name="email" maxlength="256" type="email">
                                                </div>
                                            </div>
                                            <div class="phone bot css">
                                                <label data-focused="false" class="f-label">移动电话号码</label>
                                                <div class="input">
                                                    <input name="phone" type="number">
                                                </div>
                                            </div>
                                            <div class="pass bot css">
                                                <label data-focused="false" class="f-label">密码<span>*</span></label>
                                                <div class="input">
                                                    <input name="password" type="password">
                                                    <div class="icon">
                                                        <div class="btn">
                                                            <img src="./images/eye-off.png" width="25">
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="pass bot css">
                                                <label data-focused="false" class="f-label">确认密码<span>*</span></label>
                                                <div class="input">
                                                    <input name="rpassword" type="password">
                                                    <div class="icon">
                                                        <div class="btn">
                                                            <img src="./images/eye-off.png" width="25">
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="email bot css">
                                                <label data-focused="false" class="t-label">国家或地区<span>*</span></label>
                                                <div class="input">
                                                    <select name="">
                                                        <option value="1">中国</option>
                                                        <option value="2">中国香港特别行政区</option>
                                                        <option value="3">中国澳门特别行政区</option>
                                                        <option value="4">国际版</option>
                                                    </select>
                                                </div>
                                            </div>
                                            <div>
                                                <label class="css input" style="border: none;">
                                                <span class=" css-c">
                                                    <input type="checkbox" checked="checked">
                                                </span>
                                                <span class="text">HP 可向我发送定制产品和服务、技术支持更新和活动新闻的电子邮件。</span>
                                            </label>
                                            </div>
                                            <div class="items">
                                                <div class="tnc">单击“创建帐户”，即表明您同意
                                                    <a href="javascript:;">HP 隐私声明</a>
                                                </div>
                                                <button class="regist">
                                                    <span>创建帐户</span>
                                                </button>
                                            </div>
                                        </form>

                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</body>
<script src="./js/cookie.js"></script>
<script src="./js/register.js"></script>

</html>